<?php 
/*
 * M版分类列表页
 * CategoryPage_Index_Index
 */ 
?>
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
<script type="text/javascript">
//<![CDATA[
(function($){
    $('.em-inner-main .em-col-main').css('padding','0px 0px 3rem');
})(jQuery);
//]]

</script>
<style type="text/css">
    .category {position:relative;}
    .category .category_nav {position:absolute;width: 100%;top:0;left:0;border-right: 1px solid #fff;}
    .category .category_nav a{width:100%;}
    .category .category_nav span{color: #434343;display: block;padding: 16px;margin-left: 46px;border-bottom: 1px solid #ddd;font-family: Lato,Helvetica Neue, Helvetica, Arial, sans-serif,FontAwesome;}
    .category .category_nav div a::before {width: 46px;float: left;padding: 8px;font-size: 26px;text-align: center;}   
    .category .category_nav div.active a::before{background: #e33e3e;border: 1px solid #e33e3e;}
    .category .category_nav div.active span{color:#fff;}
    .category .category_val {position: relative;margin-left: 46px;top: 0;}
    .category .category_val .category_navVal >div >a{display:block;width:100%;padding:14px;border-bottom: 1px solid #e33e3e;background: #eee;font-family: Lato,Helvetica Neue, Helvetica, Arial, sans-serif,FontAwesome;}
    .category .category_val .navbar-nav{margin:0px;}
    .category .category_val a{color: #434343;font-size: 18px;}
    .category .category_val .navbar-nav > li > a{border-bottom: 1px solid #ddd;padding: 12px;background: #fdfdfd;}

    .category .nav-activity-title h3{border-bottom: 2px solid #bcbcbc;padding: 1rem;padding-top: 0;margin:0;color: #e33e3e;}

    .category .category_nav .fa-angle-right:before{float:right;padding-right: 2rem;}
    .category_val .fa-angle-down:before{float: right;padding-right: 2rem;}
    
</style>
</head>
<?php 
//配置项
    $code    = $this->getRequest()->getParam("code");
    $codeId  = !empty($code) ? $code : 0;
    $codeIds = array();
    $_helper     = Mage::helper('catalog/category');
    $_categories = $_helper->getStoreCategories();
    $codes   = '';
    foreach ($_categories as $_category) {
        $_categoryId = $_category->getId();
        if($_categoryId==$codeId){
            $codes = "1";
        }
        $codeIds[]   = $_categoryId;
    }
?>
<body>
<div class="category">
    <div class="nav-activity-title"><h3><?php echo $this->__('Category') ?></h3></div>
    <div style="position: relative;" class="category_con">
         <?php if (count($_categories) > 0): ?>
            <div class="category_nav">
                <?php foreach($_categories as $_category): ?>
                    <?php $_categoryId = $_category->getId() ?>
                    <div class="category_navTop categoryNavId_<?php echo $_categoryId ?>">
                        <a href="#categoryId_<?php echo $_categoryId ?>" data-toggle="collapse" class="fa icon-sf-<?php echo $_categoryId ?>">
                            <span class="fa fa-angle-right"><?php echo $_category->getName() ?></span>
                        </a>
                    </div>
                <?php endforeach; ?>
            </div>
            <div class="category_val">
                <?php foreach($_categories as $_category): ?>
                    <?php $_categoryId = $_category->getId(); ?>
                    <div id="categoryId_<?php echo $_categoryId ?>" class="collapse category_navVal category_navTop categoryValId_<?php echo $_categoryId ?>">
                        <?php $_category = Mage::getModel('catalog/category')->load($_categoryId) ?>
                        <?php $_subcategories = $_category->getChildrenCategories() ?>
                        <?php foreach($_subcategories as $_subcategory): ?>
                            <?php 
                                $_subcategoryId = $_subcategory->getId();
                                $_category = Mage::getModel('catalog/category')->load($_subcategoryId);
                                $_subcategories = $_category->getChildrenCategories();
                            ?>
                            <div>
                                <a <?php if (count($_subcategories) > 0): ?> href="#subcategory_<?php echo $_subcategoryId ?>" data-toggle="collapse" class="fa fa-angle-down"<?php else: ?>href="<?php echo $_helper->getCategoryUrl($_subcategory) ?>"<?php endif; ?>>
                                    <?php echo $_subcategory->getName() ?>
                                </a>
                            </div>
                            <?php if (count($_subcategories) > 0): ?>
                            <div id="subcategory_<?php echo $_subcategoryId ?>" class="collapse">
                                <ul class="nav navbar-nav">
                                    <?php foreach($_subcategories as $_subcategory): ?>
                                        <li>
                                            <a href="<?php echo $_helper->getCategoryUrl($_subcategory) ?>">
                                                <?php echo $_subcategory->getName() ?>
                                            </a>
                                        </li>
                                    <?php endforeach; ?>
                                </ul>
                            </div>
                            <?php endif; ?>
                        <?php endforeach; ?>
                    </div>
                <?php endforeach; ?>
            </div>
        <?php endif; ?>          
    </div>
</div>
<div style="position: relative;"></div>
</body>
<script type="text/javascript">
// <![CDATA[
(function($){
    $(".em-banner-slideshow").css({'margin':'0px',"padding":"0px","height":"0px"});

    //页面跳转指定分类
    var codeId  = "<?php echo $codeId ?>";
    var codes   = "<?php echo $codes ?>";
    if(codes == '1'){
        var categoryNavId = '.categoryNavId_'+codeId;        
        var categoryValId = '.categoryValId_'+codeId;
        $(categoryNavId).addClass('active');  
        $(categoryValId).addClass('in');
        $('.category_nav').css({"width":"46px","border-color":"#e33e3e"});
        $('.category_navTop a span').css('display','none');
    }/*else{
        $(".category .category_val >div:first-child").addClass('in');
        $(".category .category_nav >div:first-child").addClass('active');
    }*/

    //点击切换
    $(".category .category_nav >div").click(function(){
        $('.category_nav').css({"width":"46px","border-color":"#e33e3e"});
        $('.category_navTop a span').css('display','none');
        $(this).addClass('active').siblings().removeClass('active');
        $('.category .category_val >div').addClass('in').siblings().removeClass('in');
    });  
    $(".category h3").click(function(){
        $('.category_nav').css({"width":"100%","border-color":"#fff"});
        $('.category_navTop ').removeClass('active');
        $('.category .category_val >div').removeClass('in');
        $('.category_navTop a span').css('display','block');
    })

    //页面加载最低高度
    var categoryHeig = $('.category_nav').height();
    $('.category .category_con').css({'min-height':categoryHeig});
    //$('.category .category_con .category_val').css({'min-height':categoryHeig,'background': '#eee'});

})(jQuery);
// ]]>
</script>
</html>